<script setup>
// npm i echarts
    import * as echarts from 'echarts'
    import { onMounted, ref } from 'vue';
    const chartRef = ref(null)
    const option = {
        title: {
            text: 'ECharts ⼊⻔案例',
        },
        xAxis: {
            data: ['衬衫', '⽺⽑衫', '雪纺衫', '裤⼦', '⾼跟鞋', '袜⼦'],
        },
        yAxis: {},
        series: [
            {
                name: '销量',
                type: 'bar',
                data: [5, 20, 36, 10, 10, 20],
            }
        ]
    }
    onMounted(() => {
        const chart = echarts.init(chartRef.value)
        chart.setOption(option)
    })
</script>
<template>
<div class="chart-box" ref="chartRef"></div>
</template>
<style scoped>
.chart-box {
width: 400px;
height: 300px;
margin: 100px auto;
border: 3px solid #000;
border-radius: 6px;
} 
</style>